// 引入矢量图样式
require("../../iconfont/iconfont.css");
require("../../iconfont/iconfont.css");

// 引入验证码插件
const CaptchaMini = require("captcha-mini");

// 导入请求实例
const request = require("../../utils/request");

// 引入公共样式
require("../../assets/css/css.less");

// 引入css样式
require("./reg.less");

// 加载后验证
window.onload = () => {
    let captcha1 = new CaptchaMini({
        fontSize: 60,
        length: 5,
    });
    // 画图
    let captcha = ""; //储存验证码 给提交表单用
    captcha1.draw(document.querySelector("#captcha1"), (r) => {
        // 打印验证码
        captcha = r;
        console.log(r, "验证码1");
    });
    // 获取标签
    const account = document.querySelector("#account");
    const auth = document.querySelector("#auth");
    const password = document.querySelector("#password");
    const rePass = document.querySelector("#rePass");
    const form1 = document.querySelector("#form1");
    const case1 = document.querySelector("#case1");
    const iconfont2 = document.querySelector(".iconfont2");
    const regSd = document.querySelector(".regSd");

    // 验证手机号（11位数字）
    // 正则表达式
    let res1 = /^1[3|4|5|6|7|8|9][0-9]{9}$/;
    //验证密码（6-18位必须包含字母的数据）
    // 正则表达式
    let res3 = /^(?=.*[a-zA-Z]).{6,18}$/;

    // 注册事件
    form1.addEventListener("submit", function(e) {
        // 收集错误信息
        let error = "";
        // 判断是否都正确
        if (!res1.test(account.value)) {
            case1.style.display = "block";
            regSd.textContent = "手机号格式错误";
            aaa();
            e.preventDefault();
            error = "1";
        } else if (auth.value.toLowerCase() !== captcha.toLowerCase()) {
            case1.style.display = "block";
            regSd.textContent = "验证码不正确";
            aaa();
            e.preventDefault();
            error = "2";
        } else if (!res3.test(password.value)) {
            case1.style.display = "block";
            regSd.textContent = "密码为6-18位数字字母";
            aaa();
            e.preventDefault();
            error = "3";
        } else if (rePass.value !== password.value) {
            case1.style.display = "block";
            regSd.textContent = "再次确认正确密码";
            aaa();
            e.preventDefault();
            error = "4";
        } else {
            // case1.style.display='block';
            // regSd.textContent='注册成功';
            // iconfont2.classList.remove('icon-cancel-1-copy');
            // iconfont2.classList.add('icon-duigou');
            e.preventDefault();
            // bbb();

            // 发送请求，检测账号是否存在
            request
                .post("/api/user/isExist", {
                    account: account.value,
                })
                .then((res) => {
                    console.log("res:", res);
                    // 解构数据
                    let { errno, message } = res.data;
                    // 判断
                    if (errno === 0) {
                        // 发送请求
                        return request.post('/api/user/register', {
                            account: account.value,
                            password: password.value,
                        }).then(res => {
                            console.log('res.data:', res.data);
                            // 解构数据
                            let { data, errno } = res.data;
                            // 判断
                            if (errno === 0) {
                                // 跳转
                                case1.style.display = 'block';
                                regSd.textContent = '注册成功';
                                iconfont2.classList.remove('icon-cancel-1-copy');
                                iconfont2.classList.add('icon-duigou');
                                e.preventDefault();
                                bbb();
                            }
                        })
                    } else {
                        // alert("用户名已存在");
                        case1.style.display = "block";
                        regSd.textContent = message;
                        aaa();
                    }
                })
                // .catch((err) => {
                //     console.log("err:", err);
                // });
        }
    });
    // 封装定时器函数
    function aaa() {
        setTimeout(function() {
            case1.style.display = "none";
        }, 2000);
    }

    function bbb() {
        setTimeout(function() {
            case1.style.display = "none";
            location.href = './login.html';
        }, 3000);
    }
};